<!DOCTYPE html>
<html lang="zh-CN" style="color-scheme: dark;">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ayin - 软件开发 </title>
    <link rel="stylesheet" href="./css/style.min.css">
    <link rel="stylesheet" href="./js/element/element.css">
    <link rel="shortcut icon" href="./assets/public/favicon.svg"/>
    <script src="./js/typed.umd.js"></script>
    <script src="./js/vue/dist/vue.min.js"></script>
    <script src="./js/element/element.js"></script>
</head>
<body>
    <canvas class="fireworks"></canvas>
    <div class="head">
        <div class="main">
            <a href="./index.html" class="logo"><img src="./assets/public/logo_text.svg"></a>
            <div class="menu">
                <li class="magical btn nav" onclick="window.location.href='./index.html'">主页</li>
                <li class="magical btn" onclick="window.location.href='./work.html'">工作</li>
                <li class="magical btn" onclick="window.location.href='./blog.html'">公众号</li>
                <li class="magical btn" onclick="window.location.href='./about.html'">关于</li>
            </div>
            <div class="menu" id="menu-expand">
                <li class="magical btn skin" id="menu-expand-child"><i class="icon menu-icon"></i></li>
            </div>
            <div id="menu-panel">
                <div class="menu-panel-content">
                    <li class="magical btn nav" onclick="window.location.href='./index.html'">主页</li>
                    <li class="magical btn" onclick="window.location.href='./work.html'">工作</li>
                    <li class="magical btn" onclick="window.location.href='./blog.html'">公众号</li>
                    <li class="magical btn" onclick="window.location.href='./about.html'">关于</li>
                </div>
            </div>
        </div>
        <blockquote><img src="./assets/public/logo.svg"></blockquote>
    </div>
    <div id="app">
    <div class="index">
        <div class="hello">
            <div class="title">
                <div class="title-hi">嗨，我是</div>
                <a class="title-name" href="https://asorn.cn">Ayin</a>
            </div>
            <div class="hello-desc" id="typed"></div>
        </div>
        <div class="content-divider"></div>
        <div class="quickly-link">
            <div class="title-hi">What did I do</div>
            <div class="loader"></div>
            <div class="link-card">
                    <div class="link-card-list">
                        <div class="magical link-card-item">
                            <a href="https://w2.flyingwaves.co/webAdmin/login/index" target="_blank">
                                <img src="./assets/index/pwa.png" alt="">
                                <div class="info">
                                    <div class="info-title">PWA平台</div>
                                    <div class="info-desc">一种可以将网站转换为桌面应用或APK，并统计落地页打开、应用安装次数和使用情况的平台，为应用出海提供便捷解决方案。（自研）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="https://play.google.com/store/apps/details?id=org.chen.wordwave" target="_blank">
                                <img src="./assets/index/wordwave-playstore.png" alt="">
                                <div class="info">
                                    <div class="info-title">WordWave</div>
                                    <div class="info-desc">一款帮助人们学习英语的软件，通过小游戏提升单词记忆力，并提供每日签到和抽奖等福利，增加学习的趣味性和参与度。（正在封闭式测试中）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="https://typecho.scoremaster.top" target="_blank">
                                <img src="./assets/index/wheel.png" alt="">
                                <div class="info">
                                    <div class="info-title">Lucky Wheel</div>
                                    <div class="info-desc">一个转盘抽奖网页，为出海公司提供引流技术支持，通过有趣的抽奖活动吸引用户参与并增加品牌曝光。（国外项目）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="https://play.google.com/store/apps/details?id=com.whisperly.echotalk.starryb" target="_blank">
                                <img src="./assets/index/blink-playstore.png" alt="">
                                <div class="info">
                                    <div class="info-title">Blink Chat</div>
                                    <div class="info-desc">一款AI聊天软件，通过智能对话流和即时响应技术，为用户提供高效、个性化的沟通和信息获取体验。（已在Google商店上架）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="https://play.google.com/store/apps/details?id=org.birdchat.talkworld" target="_blank">
                                <img src="./assets/index/bird-playstore.png" alt="">
                                <div class="info">
                                    <div class="info-title">Bird Chat</div>
                                    <div class="info-desc">一款多功能社交应用，提供聊天、发布朋友圈和查看体育资讯等功能，帮助用户随时随地高效沟通和分享精彩生活。（正在封闭式测试中）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="javascript:void(0)" @click="showNoLinkMessage">
                                <img src="./assets/index/na.png" alt="">
                                <div class="info">
                                    <div class="info-title">娜么美</div>
                                    <div class="info-desc">一个垂直美妆平台，通过线上线下相结合的经营模式，满足年轻人和女性对美妆产品的强烈需求和兴趣，帮助美妆连锁店提升客户体验并拓展市场。（外包项目）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="javascript:void(0)" @click="showNoLinkMessage">
                                <img src="./assets/index/zhi.png" alt="">
                                <div class="info">
                                    <div class="info-title">智慧物业</div>
                                    <div class="info-desc">一个基于微服务架构的综合管理平台，通过微信小程序为住户提供便捷社区服务，并通过物业管理平台提升物业管理效率和住户满意度。（外包项目）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="javascript:void(0)" @click="showNoLinkMessage">
                                <img src="./assets/index/xin.png" alt="">
                                <div class="info">
                                    <div class="info-title">信达乐</div>
                                    <div class="info-desc">一个前后端分离的信用贷款管理系统，提高信贷机构客户关系管理的效率，防止客户隐私泄漏，优化内部管理流程。（外包项目）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="javascript:void(0)" @click="showNoLinkMessage">
                                <img src="./assets/index/study.png" alt="">
                                <div class="info">
                                    <div class="info-title">学程匠心</div>
                                    <div class="info-desc">一个专注于课程管理、用户管理、报告统计和数据分析等核心功能的综合平台，通过多个模块帮助教育机构实现智能管理和优化教育内容及培训程序，提升教育服务的效率和智能化水平。（外包项目）</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                        <div class="magical link-card-item">
                            <a href="https://nav.dippermap.com/" target="_blank">
                                <img src="./assets/index/a campus second-hand trading system.png" alt="">
                                <div class="info">
                                    <div class="info-title">毕业设计项目</div>
                                    <div class="info-desc">校园二手交易系统</div>
                                </div>
                                <div class="icon icon-arrow">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                        <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                    </svg>
                                </div>
                            </a>
                        </div>
                    </div>
                <svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8" fill="none">
                    <path fill-rule="evenodd" clip-rule="evenodd" d="M3.5 8V0H4.5V8H3.5Z" fill="#62616F"></path>
                    <path fill-rule="evenodd" clip-rule="evenodd" d="M8 4.5H0V3.5H8V4.5Z" fill="#62616F"></path>
                </svg>
                <div class="link-card-list">
                    <div class="magical link-card-item">
                        <a href="https://space.bilibili.com/272467430" target="_blank">
                            <img src="./assets/index/bilibili.png" alt="">
                            <div class="info">
                                <div class="info-title">bilibili</div>
                                <div class="info-desc">My knowledge garden</div>
                            </div>
                            <div class="icon icon-arrow">
                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                    <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                </svg>
                            </div>
                        </a>
                    </div>
                    <div class="magical link-card-item">
                        <a href="https://gitee.com/Martinkeep" target="_blank">
                            <img src="./assets/index/gitee.png" alt="">
                            <div class="info">
                                <div class="info-title">Gitee</div>
                                <div class="info-desc">My code garden</div>
                            </div>
                            <div class="icon icon-arrow">
                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                    <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                </svg>
                            </div>
                        </a>
                    </div>
                    <div class="magical link-card-item">
                        <a href="https://github.com/333495" target="_blank">
                            <img src="./assets/index/github.png" alt="">
                            <div class="info">
                                <div class="info-title">GitHub</div>
                                <div class="info-desc">My code garden</div>
                            </div>
                            <div class="icon icon-arrow">
                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
                                    <path d="M10.55 7.58332H1.16663V6.41665H10.55L7.75415 3.62082L8.5791 2.79587L12.1645 6.3813C12.5062 6.72299 12.5062 7.27701 12.1645 7.61873L8.5791 11.2042L7.75415 10.3792L10.55 7.58332Z" fill="#B3B3C1"></path>
                                </svg>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <div class="footer">
        <div class="copyright">
            <div>© 2024 Design by <a href="https://asorn.cn/" target="_blank">Ayin</a></div>
            <span>|</span>
            <div class="friends">
                <a href="https://asorn.cn/" target="_blank">Asorn</a>
            </div>
        </div>
    </div>
    <div class="widget">
        <div class="shape-light"></div>
        <div class="shape-star">
            <div class="rising-stars rising-stars-visible">
                <div style="height:1px;width:1px"></div>
                <div style="height:2px;width:2px"></div>
                <div style="height:1px;width:1px"></div>
            </div>
        </div>
        <div class="shape-earth"></div>
    </div>
</body>
<script>
    new Vue({
        el: '#app',
        methods: {
            showNoLinkMessage() {
                this.$message({
                    message: '暂无链接',
                    type: 'warning'
                });
            }
        }
    });
</script>
<script>
    // 打字效果，感谢 typed.js: https://mattboldt.github.io/typed.js/docs/
    const options = {
        strings: [
            ">_ welcome to my secret garden ^1000",
            ">_ and let's explore it now ^1000",
        ],
        typeSpeed: 50, // 打印速度
        backSpeed: 20, // 回退速度
        startDelay: 300, // 开始之前的延迟300毫秒
        loop: true, // 是否循环
        showCursor: false, // 不显示光标
    };
    const typed = new Typed('#typed', options);
</script>
<script src="./js/main.min.js"></script>
<script src='./js/anime.js'></script>
<script src='./js/firework.js'></script>
</html>